<template>
  <!-- 断点续传/秒传资源 -->
  <!-- https://github.com/iamhmx/UpUpload -->
  <!-- https://blog.csdn.net/weixin_34051201/article/details/88007282 -->
  <!-- https://blog.csdn.net/lixiaosenlin/article/details/114400710?utm_medium=distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromMachineLearnPai2~default-3.vipsorttest&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2~default~BlogCommendFromMachineLearnPai2~default-3.vipsorttest -->
  <div class="container">
    <UploadStep
		v-for="item in steps"
		:key="item.name"
		:item="item"
	></UploadStep>
  </div>
</template>

<script>
import UploadStep from './components/UploadStep'
export default {
	components: {
		UploadStep,
	},
	data() {
		return {
			steps: [
				{
					id: 0,
					name: 'v1.0：进度条',
					icon: 'el-icon-light-rain',
				},
				{
					id: 1,
					name: 'v2.0：拖拽',
					icon: 'el-icon-lightning',
				},
				{
					id: 2,
					name: 'v3.0：图片格式校验',
					icon: 'el-icon-heavy-rain',
				},
				{
					id: 3,
					name: 'v4.0：大文件切片',
					icon: 'el-icon-sunrise',
				},
				{
					id: 4,
					name: 'v5.0：秒传&断点续传',
					icon: 'el-icon-sunrise-1',
				},
				{
					id: 5,
					name: 'v6.0：并发控制',
					icon: 'el-icon-sunset',
				},
				{
					id: 6,
					name: 'v7.0：失败重试&错误控制',
					icon: 'el-icon-sunny',
				},
			]
		}
	}
}
</script>

<style lang="scss" scoped>

</style>